/*
 * 组件注释
 * @Author: wuq-l
 * @Date: 2022-09-05 17:22:34
 * @LastEditors: wuq-l
 * @LastEditTime: 2023-01-13 09:42:11
 * @Description: 点击按钮弹出来的拉下框
 * 既往不恋！当下不杂！未来不迎！！！
 */
"use strict";
import React from "react";
import { Link } from "umi";
import Gconfirm from "@/component/confirm";
import { Dropdown, Modal } from "antd";
import { AppstoreFilled, ExclamationCircleOutlined } from "@ant-design/icons";

const customMenuItem = btns => {
  return btns.map((item, index) => {
    const { type, event, label, href, link, ...args } = item;

    let menuItem = {
      className: "dropdown-item",
      label: label,
      ...args,
    };

    if (args.disabled) {
      return menuItem;
    }

    switch (type) {
      case "delete":
      case "cancel":
        return {
          ...menuItem,
          onClick: ({ domEvent }) => {
            domEvent.stopPropagation();
            Modal.confirm({
              title: `确认${label}？${label}后不可恢复！`,
              icon: <ExclamationCircleOutlined />,
              okText: "确认",
              cancelText: "取消",
              onOk: event,
            });
          },
        };
      case "export":
        return {
          ...menuItem,
          onClick: ({ domEvent }) => {
            domEvent.stopPropagation();
            const a = document.createElement("a");
            a.target = "_blank";
            a.herf = href;
            a.click();
          },
        };
      default:
        const events = {
          ...(event ? { onClick: ({ domEvent }) => event(domEvent) } : {}),
        };

        return {
          ...menuItem,
          ...events,
          label: link ? <Link to={link}>{label}</Link> : label,
        };
    }
  });
};

const Index = ({ btns }) => {
  const items = customMenuItem(btns);

  return (
    <Dropdown menu={{ items }}>
      <a className="ant-dropdown-link" onClick={e => e.preventDefault()}>
        <AppstoreFilled />
      </a>
    </Dropdown>
  );
};
export default Index;
